let path = require('path'),
	webpack = require('webpack'),
	glob = require('glob'),
	ExtractTextPlugin = require('extract-text-webpack-plugin'),
	HtmlWebpackPlugin = require('html-webpack-plugin');

let entries = getEntry('./src/js/*.js'),
	pageObj = getEntry('./src/html/*.html'),
	pages = Object.keys(pageObj);

let config = {
	entry: entries,
	output: {
		path: path.resolve(__dirname, 'dist'),
		filename: 'js/[name].js'
	},
	module: {        
        rules: [
            {
                test: /\.css$/,
                exclude: /^node_modules$/,
                use: ExtractTextPlugin.extract({ 
                    fallback: 'style-loader',
                    use: 'css-loader'
                })
            },
            {
                test: /\.less$/,
                exclude: /^node_modules$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: ['css-loader', 'less-loader']
                })
            },
            {
                test: /\.js$/,
                exclude: /^node_modules$/,
                use: {
                    loader: 'babel-loader'
                }
            },
            {
                test: /.(png|jpg|gif)$/,
                exclude: /^node_modules$/,
                use: {
                    loader: 'url-loader',
                    options: {
                        name: '[hash:8].[name].[ext]',
                        limit: 8192,
                        outputPath: 'img/',
                        publicPath: '../img'
                    }
                }
            },
            {
                test   : /\.woff|\.woff2|\.svg|.eot|\.ttf|\.swf/,
                exclude: /^node_modules$/,
                use : 'url-loader?prefix=font/&limit=10000&name=fonts/[name].[ext]'
            },
            {
                test: /.html$/,
                exclude: /^node_modules$/,
                use: 'html-loader'
            }
        ]
    },
    resolve: {
        // 该项配置能够在加载资源的时候省略后缀名
        extensions: [' ', '.js', '.jsx', '.less', '.css'],
        // 配置路径别名
        alias: {
            '@src': path.resolve(__dirname, './src/'),
            '@img': path.resolve(__dirname, './src/img/'),
            '@js': path.resolve(__dirname, './src/js/'),
            '@css': path.resolve(__dirname, './src/css/')
        }
    },
	plugins: [
		//单独打包css
        new ExtractTextPlugin('css/[name].min.css'),
        new webpack.LoaderOptionsPlugin({ //压缩css
            minimize: true
        })
	],
	devServer: {
		port: 7777
	}
}

pages.forEach((pathname) => {
	let conf = {
		filename: pathname + '.html', // 生成的html存放路径，相对于path
		template: pageObj[pathname], // html模板路径
		inject: true, // 允许插件修改哪些内容，包含head和body
		hash: true, //是否添加hash值
		minify: { //压缩HTML文件
            removeComments: true, //移除HTML中的注释
            collapseWhitespace: false //删除空白符与换行符
        },
        chunks: [pathname]	// 引入对应的JS
	}
	config.plugins.push(new HtmlWebpackPlugin(conf));
})


// 按文件名来获取入口文件（即需要生成的模板文件数量）
function getEntry(globPath) {
	let files = glob.sync(globPath),
		entries = {},
		entry, dirname, basename, pathname, extname;

	for (var i = 0; i < files.length; i++) {
		entry = files[i];
		dirname = path.dirname(entry);
		extname = path.extname(entry);
		basename = path.basename(entry, extname);
		pathname = path.join(dirname, basename);
		entries[basename] = files[i];
	}
	return entries;
}

module.exports = config;